<!DOCTYPE HTML>
<html>

<head>
      <meta charset="utf-8">
      <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
      <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
      <title>Hello APP</title>
      <link rel="stylesheet" type="text/css" href="../css/api.css" />


    <style>
      body{
        padding-top: 1.5rem;
      }
    .page{
      background: white;
      width:100%;
      height: 100%;


    }
    #header{
      width:100%;
      font-size: 1.1rem;
      background: white;
      margin-top:1rem;
      display: flex;
      align-items: center;


    }
    .back{
      width:1rem;
      height: 1rem;
      margin-left: 1.4rem;
      margin-right: 5.5rem;

    }
    .ok{
      width: 3rem;
          font-size: 1.1rem;
    }
        .title{
          font-size: 1.1rem;
          margin-right: 3.5rem;
          width: 7rem;

        }
        .inputwrap{
          width:100%;

        }
        .inp{
          width: 90%;
          height: 3.5rem;
          border-bottom: 0.05rem solid rgb(242,242,242);
          margin-left: 0.9rem;
          box-sizing: border-box;
        }
        textarea{
          width: 90%;
          height: 6rem;
          margin-left: 0.9rem;
          box-sizing: border-box;
          outline: none;
        }
        .footer{
          display:flex;
          justify-content: space-between;
          align-items:center;
          padding-left: 0.9rem;
          padding-right: 0.9rem;
          box-sizing: border-box;
        }
        .text{
          display: flex;
          flex-direction: column;
        }
        .switch {
            width: 3rem;
            height: 2rem;
            position: relative;
            border: 1px solid #dfdfdf;
            background-color: #fdfdfd;
            box-shadow: #dfdfdf 0 0 0 0 inset;
            border-radius: 20px;
            background-clip: content-box;
            display: inline-block;
            -webkit-appearance: none;
            user-select: none;
            outline: none;
        }
        input{
          outline: none;
        }
        .switch:before {
            content: '';
            width: 1.8rem;
            height: 1.8rem;
            position: absolute;
            top: 0;
            left: 0;
            border-radius: 1rem;
            background-color: #fff;
            box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
        }
        .switch:checked {
            border-color: rgb(64,204,203);
            box-shadow: rgb(64,204,203) 0 0 0 16px inset;
            background-color: rgb(64,204,203);
        }
        .switch:checked:before {
            left: 1.4rem;
        }
        .switch.switch-anim {
            transition: border cubic-bezier(0, 0, 0, 1) 0.4s, box-shadow cubic-bezier(0, 0, 0, 1) 0.4s;
        }
        .switch.switch-anim:before {
            transition: left 0.3s;
        }
        .switch.switch-anim:checked {
            box-shadow: rgb(64,204,203) 0 0 0 16px inset;
            background-color: rgb(64,204,203);
            transition: border ease 0.4s, box-shadow ease 0.4s, background-color ease 1.2s;
        }
        .switch.switch-anim:checked:before {
            transition: left 0.3s;
        }

    </style>


</head>

<body>
  <div class="page">
      <div id="header">
        <img src="../image/u18.png" class="back" tapmode onclick="closewin();">
           <span class="title">新增收货地址</span>
           <span class="ok" tapmode onclick="perse()">确定</span>
      </div>

        <div class="inputwrap">
          <input type="text" placeholder="收货人姓名" class="inp" id="username">
          <input type="text" placeholder="手机号码" class="inp" id="phone">
          <input type="text" placeholder="省、市、区" class="inp" id="country">
          <textarea placeholder="街道地区" id="city" style="margin-top:1rem"></textarea>
      </div>
      <div class="footer">
        <div class="text">
          <span style="font-size:1.1rem;font-weight:600;padding-bottom:0.8rem">设为默认地址</span>
            <span style="font-size:0.8rem;color:#999999">注： 每次下单时自动使用该地址</span>
        </div>
        <input class="switch switch-anim" type="checkbox" checked id="state">

</div>

</body>
    <script type="text/javascript" src="../script/jquery-1.8.3.js"></script>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/common.js"></script>
<script type="text/javascript">
var userinfo = $api.getStorage('userinfo');

apiready = function() {

}

function perse() {
  var name = $("#username").val()
  var phone = $("#phone").val()
  var country = $("#country").val()
  var city = $("#city").val()
  var state = $("#state").val()
  if(name=='' || phone=="" || country=="" || city==""){
    msgcode('请填写完整')
    return false
  }
  api.ajax({
      url: SITE_URL+'product_api/address/add_address',
      method: 'post',
      data: {
          values: {
              user_id: userinfo.id,
              province:country,
              street:city,
              name:name,
              phone:phone,
              status:state
          }
      }
  },function(ret, err){
      if (ret) {
        if(ret.error==200){
          msgcode('添加成功')
          api.sendEvent({
              name: 'add_address',

          });

          setTimeout(function () {
            api.closeWin({

            });
          },500)


        }else{
          msgcode('添加失败,稍后再试')
        }
          //alert( JSON.stringify( ret ) );
      } else {
        msgcode('请检查网络连接')
          //alert( JSON.stringify( err ) );
      }
  });

}








</script>

</html>
